﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Cascade.aspx.cs" Inherits="IGIS.Extensions.SearchInBlock.Cascade" %>


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title></title>
    <!--<link href="../../css/Default.css" rel="stylesheet" type="text/css" />
    <link href="../../css/sorter.css" rel="stylesheet" type="text/css" />-->
         <link rel="stylesheet" href="../../styles/viewer.css" type="text/css" />
         <link rel="stylesheet" href="../../styles/autoSuggest.css" type="text/css" />
           <!--<script src="" type="text/javascript"></script>-->
               <script src="../../Scripts/jquery.min.js" type="text/javascript"></script>

 <script src="chosen/chosen.jquery.js" type="text/javascript"></script>
  <script src="../../Scripts/ajax-chosen.min.js" type="text/javascript"></script>
     
  <link rel="stylesheet" href="chosen/chosen.css" />
      
	<script language="javascript" type="text/javascript">
        try {
            if (parent.document.all.tags("Frameset").item(1) != null) {
                parent.document.all.tags("Frameset").item(1).cols = '*,270';
            }
            else {
                parent.parent.document.all.tags("Frameset").item(1).cols = '*,270';
            }
        }
        catch (e) { }

        var colCount = <%= numCols %>;
        var curRow = -1;

        function Init() {
            
        }
        function OnMouseDown(e)
        {
            parent.parent.ForwardMouseDown(document, e);
        }
        function CellClicked(sel)
        {
        parent.parent.SetSelectionXML(sel);
        parent.parent.ExecuteMapAction(10);
        }
    </script>
     <style>
    /* RESET */
    html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a,
    font, img, dl, dt, dd, ol, ul, li, legend, table, tbody, tr, th, td 
    {margin:0px;padding:0px;border:0;outline:0;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;list-style:none;}
    a img {border: none;}
    ol li {list-style: decimal outside;}
    fieldset {border:0;padding:0;}
    
    body { font-family: sans-serif; font-size: 1em; }
    
    div#container { width: 200px; margin: 0 auto; padding: 1em 0;  }
    p { margin: 1em 0; max-width: 200px; }
    h1 + p { margin-top: 0; }
    
    h1, h2 { font-family: Georgia, Times, serif; }
    h1 { font-size: 2em; margin-bottom: .75em; }
    h2 { font-size: 1.5em; margin: 2.5em 0 .5em; border-bottom: 1px solid #999; padding-bottom: 5px; }
    h3 { font-weight: bold; }
    
    ul li { list-style: disc; margin-left: 1em; }
    ol li { margin-left: 1.25em; }
    
    div.side-by-side { width: 100%; margin-bottom: 1em; }
    div.side-by-side > div { float: left; width: 50%; }
    div.side-by-side > div > em { margin-bottom: 10px; display: block; }
    
    a { color: orange; text-decoration: underline; }
    
    .faqs em { display: block; }
    
    .clearfix:after {
      content: "\0020";
      display: block;
      height: 0;
      clear: both;
      overflow: hidden;
      visibility: hidden;
    }
    
    footer {
      margin-top: 2em;
      border-top: 1px solid #666;
      padding-top: 5px;
    }

 

        .searchResultTitle
        {
            margin-top:10px;
			border-style:outset;
			border-width:2px;
            background-color:#999;
            color:#FFF;
            padding:0.3em;
            text-align:center;
            font-weight:bold;
            cursor:pointer;
        }
        .searchResultTitle:hover
        {
            text-decoration:underline;
        }
        
        
    </style>
</head>
<body>
    <form id="form1" runat="server">
     
    <div style="text-align:right;">
        <div id="header" style="margin-left:5px;margin-top:5px;font-family:Arial;font-size:13px;">
          <b> <%= Request["HeaderMassage"]%></b> 
        </div>
		<div id="MainContent">
			<div id="Prompt" class="infoBlock" style="display:none;">
				<%= Request["UserMassage"]%>
			</div>
           
			
			
			

             
        
       <div id="container">
    <div class="side-by-side clearfix">
      <div>
     
      </div>
      <div style="margin-left:5px;">
       
       
        <select data-placeholder="בחר עיר..."   class="chzn-select chzn-select-deselect chzn-rtl"   style="width:200px;" tabindex="4" ID="txtCities"  runat="server" >
        <option value=""></option> 
         
        </select>

       
      </div>
      <br />
      <div style="margin-left:5px;margin-top:15px;">
        
        
        <select data-placeholder="בחר רחוב..." class="chzn-select chzn-select-deselect chzn-rtl"  style="width:200px;" tabindex="4" ID="txtStreets"  runat="server" >
        <option value=""></option> 
           
        </select>
        
      </div>

       
       
 

 

 
          
    </div>
    

 
    <div style="margin-left:5px;text-align:right;font-family:Arial;font-weight:12px;" id="selectedStreets" runat="server">
         
         </div>

  <div style="margin-left:5px;">
  <input type="button" id="BtnClearAll" class="clsLongButton" value="נקה הכל" />

        </div>
      
  </div>
  </div>
  
    
  
			<asp:Panel ID="_ErrorMessage" runat="server" CssClass="doErrorMessage" Visible="false">
			</asp:Panel>
			<asp:Panel ID="ResultPanelTitle" runat="server" ToolTip="התמקד/י">
				<asp:Literal ID="litResultPanelTitle" runat="server" />
			</asp:Panel>
			<asp:Panel ID="ResultPanel" style="margin-bottom:5px;margin-top:5px" runat="server" Visible="false">
				<div  class="scrollable" style="max-height: 400px">
					<asp:Literal ID="ResultContainer" runat="server" />
				</div>
			</asp:Panel>

            <asp:Panel ID="SelectedPanel" style="margin-bottom:5px;margin-top:5px" runat="server" Visible="false">
				<div  class="scrollable" style="max-height: 400px">
					<asp:Literal ID="SelectedContainer" runat="server" />
				</div>
			</asp:Panel>

           
		</div>
    </div>
    <div id="MatchLabel">
        <input type="hidden" name="HeaderMassage" value="<%= Request["HeaderMassage"] %>" />
        <input type="hidden" name="UserMassage" value="<%= Request["UserMassage"] %>" />
    </div>
   
  <script type="text/javascript">

      $(document).ready(function () {
          $("#<%=txtCities.ClientID %>").chosen();
          $("#<%=txtStreets.ClientID %>").chosen();



          $("#BtnClearAll").click(function myfunction() {
              $("#selectedStreets").empty();
              $("#<%=txtStreets.ClientID %>").empty();
              $("#<%=txtStreets.ClientID %>").trigger("liszt:updated");

              $("#<%=txtCities.ClientID %> option[selected]").removeAttr("selected");
              $("#<%=txtCities.ClientID %>").trigger('liszt:updated');
          });

          $("#<%=txtStreets.ClientID %>").trigger("liszt:updated");
          var strselectxml = "";
          $("#<%=txtCities.ClientID %>").bind("change", function () {
              //every time $progetto change, resfresh #budget's chosen


              //City: $("FIELDCLASS OR ID").val();
              var dataToSend = {
                  City: $("#<%=txtCities.ClientID %> option:selected").text(),
                  KeyLayer1: "<%=  GetfieldSession_viewState(KeyLayer2) %>",
                  SearchFld1: "<%= GetfieldSession_viewState(SearchFld2) %>",
                  KeySession: "<%= GetfieldSession_viewState(KeySession) %>",
                  KeyMapName: "<%= GetfieldSession_viewState(KeyMapName) %>",
                  KeyACProperty: "<%= GetfieldSession_viewState(KeyACProperty) %>"
              };
              $.ajax({

                  type: "POST",
                  url: "/<%=AppName %>/srv.asmx/GetStreetListByCity",
                  data: JSON.stringify(dataToSend),
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  beforeSend: function () { $("#<%=txtStreets.ClientID %>").empty(); $("#selectedStreets").empty(); },
                  success: function (data) {
                      $("#<%=txtStreets.ClientID %>").val("").trigger("liszt:updated");
                      for (var i = 0; i < data.d.streetlist.length; i++) {

                          //$("#<%=txtStreets.ClientID %>").append('<li class="active-result">' + data.d[i].key + '</li>');
                          // $("#<%=txtStreets.ClientID %>").append($("<option />").val(data.d[i].key).text(data.d[i].key));
                          $("#<%=txtStreets.ClientID %>").append('<option value="' + data.d.streetlist[i].key + '">' + data.d.streetlist[i].key + '</option>');
                          //                              $.each(data.d, function () {
                          //                                  $("#<%=txtStreets.ClientID %>").append($("<option />").val(data.d[i].key).text(data.d[i].key));
                          //                              });



                      }
                      strselectxml = data.d.SelectedXml;

                      $("#<%=txtStreets.ClientID %>").trigger("liszt:updated");


                  }
              });





          });




          $("#<%=txtStreets.ClientID %>").bind("change", function () {

              //var htmlSelectedCitiesStreet = "";

              $("#<%=selectedStreets.ClientID %>").html();
              $("#<%=selectedStreets.ClientID %>").html($("#<%=txtStreets.ClientID %> option:selected").text());

              //City: $("FIELDCLASS OR ID").val();
              var datastreetToSend = {
                  City: $("#<%=txtCities.ClientID %> option:selected").text(),
                  street: $("#<%=txtStreets.ClientID %> option:selected").text(),
                  KeyLayer1: "<%=  GetfieldSession_viewState(KeyLayer2) %>",
                  SearchFld1: "<%= GetfieldSession_viewState(SearchFld2) %>",
                  KeySession: "<%= GetfieldSession_viewState(KeySession) %>",
                  KeyMapName: "<%= GetfieldSession_viewState(KeyMapName) %>",
                  KeyACProperty: "<%= GetfieldSession_viewState(KeyACProperty) %>"
              };
              $.ajax({

                  type: "POST",
                  url: "/<%=AppName %>/srv.asmx/selectStreetPoints",
                  data: JSON.stringify(datastreetToSend),
                  contentType: "application/json; charset=utf-8",
                  dataType: "json",
                  beforeSend: function () { $("#selectedStreets").empty(); },
                  success: function (data) {


                      strselectxml = data.d;
                      CellClicked(strselectxml);
                      //  $("#<%=txtStreets.ClientID %>").trigger("liszt:updated");


                  }
              });












              //selectStreetPoints(string City ,string street, string KeyLayer1, string SearchFld1, string KeySession, string KeyMapName, string KeyACProperty)
          });

          /*$("input[type=text]").autoSuggest(data.items, {selectedItemProp: "name", searchObjProps:"name"});*/


          //          $(".chzn-select").chosen();
          //          $(".chzn-select-deselect").chosen({ allow_single_deselect: true });

          //          $('.chzn-choices input').autocomplete({
          //              source: function (request, response) {
          //                  debugger;
          //                  $.ajax({
          //                      url: "/negevgaz/srv.asmx/GetDave",
          //                      dataType: "json",
          //                      beforeSend: function () { $('ul.chzn-results').empty(); },
          //                      success: function (data) {
          //                          response($.map(data, function (item) {
          //                              $('ul.chzn-results').append('<li class="active-result">' + item.name + '</li>');
          //                          }));
          //                      }
          //                  });
          //              }
          //          });






      });
  </script>
    </form>
</body>
</html>

